<!DOCTYPE html>
<script src="../../resources/js-test.js"></script>

<div id="sandbox"></div>

<script>
description("Should update distribution when needed for querySelector and related methods.");

function test(fn)
{
    var sandbox = document.getElementById("sandbox");

    sandbox.innerHTML = "<div id=host><div id=a><div id=b></div></div>";
    host = document.getElementById("host");
    hostRoot = host.attachShadow({mode: 'open'});
    hostRoot.innerHTML = "<div id=c><slot></slot></div>";

    a = document.getElementById("a");
    b = document.getElementById("b");

    aRoot = a.attachShadow({mode: 'open'});
    aRoot.innerHTML = "<div id=d><div id=e></div></div>";

    c = hostRoot.getElementById("c");
    d = aRoot.getElementById("d");
    e = aRoot.getElementById("e");

    sandbox.appendChild(host);

    fn();

    sandbox.innerHTML = "";
}

function toArray(list)
{
    return Array.prototype.slice.call(list);
}

test(function() {
    shouldBe("aRoot.querySelector(':host-context(#c) #d')", "d");
});
test(function() {
    shouldBe("toArray(aRoot.querySelectorAll(':host-context(#c) #d'))", "[d]");
});
test(function() {
    shouldBeNull("hostRoot.querySelector('::slotted(#a)')");
});
test(function() {
    shouldBe("toArray(hostRoot.querySelectorAll('::slotted(#a)'))", "[]");
});
test(function() {
    shouldBeFalse("a.matches('::slotted(#a)')");
});
test(function() {
    shouldBeTrue("d.matches(':host-context(#host) #d')");
});
test(function() {
    shouldBeTrue("d.matches(':host-context(#c) #d')");
});
test(function() {
    shouldBeNull("b.closest('::slotted(#a)')");
});
test(function() {
    shouldBe("e.closest(':host-context(#host) #d')", "d");
});
</script>
